{% extends 'home/public/base.html' %}


{% block css %}
<link rel="stylesheet" type="text/css" href="/static/home/css/cart.css">
<link rel="stylesheet" type="text/css" href="/static/home/css/cart-app.css">
<style type="text/css">
   
   .all{
    margin-bottom: 10px;
    border-bottom: 1px dashed #ddd;
    width: 600px;
    color: #666;
   } 
  
</style>
{% endblock %}

{% block con %}
<div class="navbar-left" style="position: absolute;top:25px;left: 150px;z-index: 99999;">
    <ol class="breadcrumb" style="background-color: #fff;">
        <li>购物车</li>
        <li>确认订单</li>
        <li style="color:red;">在线支付</li>
        <li>完成 </li>
    </ol>
</div>

<div class="mainbody cart" style="padding-top: 80px;padding-bottom: 0px">
    <div class="container" >   
        <div style="margin: 20px;font-size: 26px;color: #ff6700">订单信息</div>
            <div style="margin-left: 120px;font-size: 18px">
            <div class="all">订单号:<span style="padding-left:400px;">{{ order.id }}</span></div>
            <div class="all">总计:<span style="padding-left:400px;">¥ {{ order.totalprice }}</span></div>
            <div class="all">应付:<span style="padding-left:400px;">¥ {{ order.totalprice }}</span></div>
            <div class="all">下单时间:<span style="padding-left:350px ">{{ order.addtime|date:'Y-m-d H:i:s' }}</span></div>
        </div>
 
        <div style="margin: 20px;font-size: 26px;color: #ff6700">支付方式</div>
            <ul style=" padding-left:100px;">
                <li style="float: left;padding-left:40px;">
                    <input type="radio" name="zhifu">微信
                    <img src="/static/pics/weixin.jpeg" style="width: 30px;height: 30px;">
                </li>
                <li style="float: left;padding-left:40px;">
                    <input type="radio" name="zhifu">支付宝
                    <img src="/static/pics/zfb.jpeg" style="width: 30px;height: 30px;">
                </li>
                <li style="float: left;padding-left:40px;">
                    <input type="radio" name="zhifu">银联
                    <img src="/static/pics/yinlian.jpeg" style="width: 30px;height: 30px;">
                </li>
            </ul>
        </div>

        <div onclick="show()" class="mz-btn success" id="cartSubmit" style="float: right;position: relative;right: 30px;top: 0px;font-size: 20px;margin-bottom: 10px">支付  
        </div>
       <!--  <div id="img" style="display: none; position: relative;top:-150px;left: 550px;">
            <img src="/static/pics/zfb.jpeg" style="width: 200px;height: 200px">
        </div> -->
    </div>    
</div>

<script type="text/javascript">
    // var img = document.getElementById('img');
    // function show(){
    //     if (img.style.display == 'none'){
    //         img.style.display="block";
    //     }else{
    //         img.style.display='none';
    //     }
    // }
</script>

{% endblock %}